@media screen {
    @media (max-width: 480px) {
        .layout {
            width: 100%;
            height: 100%;
            .header {
                background-color: rgba(235, 205, 55, 0.8);
                display: none;
            }
            .content {
                background-color: rgba(235, 205, 55, 0.8);
                display: block;
                width: 100vw;
                height: 100vh;
            }
        }
    }
    @media (min-width: 480px) and (max-width: 768px) {
        .layout {
            width: 100%;
            height: 100%;
            .header {
                background-color: blue;
                height: 12vh;
            }
            .content {
                background-color: rgba(235, 56, 55, 0.4);
                height: 66vh;
            }
        }
    }
    @media (min-width: 768px) and (max-width: 1200px) {
        .layout {
            width: 100%;
            height: 100%;
            .header {
                background-color: red;
                height: 9vh;
            }
            .content {
                background-color: rgba(101, 110, 11, 0.6);
                height: 33vh;
                display: block;
            }
        }
    }
}

body {
    margin: 0;
    border: 0;
    padding: 0;
}